<template>
  <div class="flex flex-column">
    <div class="flex-1">
      <a-form-model :model="entity"
                    ref="form"
                    :rules="rules"
                    :label-col="{span: 5}"
                    :wrapper-col="{span: 15}">
        <!--文本框-->
        <a-form-model-item prop="name"
                           label="名称">
          <a-input class="form-title"
                   allow-clear
                   v-model.trim="entity.name"
                   :maxLength="20"
                   placeholder="请输入"/>
        </a-form-model-item>

        <!--数字框-->
        <a-form-model-item label="排序"
                           prop="orderIndex">
          <a-input-number v-model="entity.orderIndex"
                          :min="0"
                          :max="99"/>
        </a-form-model-item>

        <!--日期选择-->
        <a-form-model-item prop="time"
                           label="时间">
          <a-date-picker v-model="entity.time"/>
        </a-form-model-item>

        <!--下拉框-->
        <a-form-model-item prop="type"
                           label="类型">
          <a-select v-model="entity.type"
                    allow-clear
                    style="width: 120px">
            <a-select-option value="1">
              选项1
            </a-select-option>
            <a-select-option value="2">
              选项2
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <!--Boolean开关-->
        <a-form-model-item prop="status"
                           label="状态">
          <a-switch v-model="entity.status"/>
        </a-form-model-item>

        <!--单选-->
        <a-form-model-item prop="radio"
                           label="单选">
          <a-radio-group v-model="entity.radio">
            <a-radio :value="1">
              A
            </a-radio>
            <a-radio :value="2">
              B
            </a-radio>
          </a-radio-group>
        </a-form-model-item>
      </a-form-model>
    </div>
    <div class="align-c">
      <a-button @click="cancel">取消
      </a-button>
      <a-button type="primary"
                :loading="onLoading"
                @click="submit">确认
      </a-button>
    </div>
  </div>


</template>
<script lang="ts">
  import { Component, Vue, Emit } from 'vue-property-decorator'
  import { mixins } from 'vue-class-component'
  import FormMixin from '@/mixins/src/formMixin'

  @Component({
    components: {}
  })
  export default class DemoForm extends mixins(FormMixin) {
    public rules: any = {
      name: [{ required: true, message: '请输入名称' }],
      orderIndex: [{ required: true, message: '请输入排序' }],
      time: [{ required: true, message: '请选择时间' }],
      type: [{ required: true, message: '请选择' }],
    }


    protected getFeignService(): any {
      // return ChannelFeignClient
    }

  }
</script>
